<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>大卫雷文案件系统</title>
    <link rel="stylesheet" href="/static/css/normalize.css">
	<link rel="stylesheet" href="/static/css/case-details.css">
	<link rel="stylesheet" href="/static/css/color-style.css">
	<link rel="stylesheet" href="/static/css/font-awesome.min.css">
    <script type="text/javascript" src="/static/js/jquery-1.11.1.min.js"></script>
</head>
<body>
	<div class="detais-box">
		<div class="top-title">
			<h3>[中国发明专利]&nbsp;&nbsp;</h3>
			<h3>CNP-SZ0976LS-LYF&nbsp;&nbsp;&nbsp;</h3>
			<h3>自发电无线开关&nbsp;&nbsp;</h3>
			<div class="clear"></div>
		</div>
		<div class="tab">
			<div class="container"> 
				<ul class="tabs"> 
					<li><a href="#tab1">案件信息</a></li>
					<li><a href="#tab2">资料记录</a></li>
					<li><a href="#tab3">案件日志</a></li>
					<li><a href="#tab4">母案案号</a></li>
					<li><a href="#tab5">事务提醒</a></li>
				</ul>
				<div class="tab_container"> 
					<div id="tab1" class="tab_content">
						<div class="info-box">
							<div class="info">
				        		<h5 class="info-title"><img src="/static/images/arrow_right.png" alt="">信息项</h5>
				        		<ul class="info-abst">
				        			<li>
				        				<label for="">申请号：</label>
				        				<input disabled class="form-input del-border" value="201510287591.X">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<label for="">申请日：</label>
				        				<input disabled class="form-input del-border" value="2015-05-29">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li>
				        				<label for="">公开号：</label>
				        				<input disabled class="form-input del-border" value="201510287591.X">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<label for="">公开日：</label>
				        				<input disabled class="form-input del-border" value="2018-05-29">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li>
				        				<label for="">申请人：</label>
				        				<input disabled class="form-input del-border" value="刘远芳">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<label for="">发明人：</label>
				        				<input disabled class="form-input del-border" value="刘远芳">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li>
				        				<label for="">客户顾问：</label>
				        				<input disabled class="form-input del-border" value="Nathan">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<label for="">案件状态：</label>
				        				<input disabled class="form-input del-border" value="立案阶段">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li>
				        				<label for="">建档时间：</label>
				        				<input disabled class="form-input del-border" value="2016-02-23">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<label for="">审核主管：</label>
				        				<input disabled class="form-input del-border" value="未指定">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li>
				        				<label for="">撰写工程师：</label>
				        				<input disabled class="form-input del-border" value="test_zlgcs">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<li class="even">
				        				<a href=""><label for="">母案案号：</label></a>
				        				<input disabled class="form-input del-border" value="201510287591.X">
				        				<i class="fa fa-pencil-square-o"></i>
				        			</li>
				        			<div class="clear"></div>
				        		</ul>
				        		<div class="clear"></div>
				        	</div>
				        	<div class="info">
				        		<h5 class="info-title"><img src="/static/images/arrow_right.png" alt="">关联案件</h5>
				        		<ul class="info-abst" style="width: 100%;">
				        			<li style="width: 100%;">
				        				<label for="">案件号码：</label>
				        				<div class="related-box">
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (立案 2015-05-29)</a>
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (维持 2015-08-18)</a>
				        					<i class="fa fa-pencil-square-o"></i>
				        				</div>
				        				<div class="related-box">
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (维持 2015-08-18)</a>
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (维持 2015-08-18)</a>
				        					<i class="fa fa-pencil-square-o"></i>
				        				</div>
				        				<div class="related-box">
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (维持 2015-08-18)</a>
				        					<a href="" class="related-box-case">CNP-SZ0976LS-LYF (维持 2015-08-18)</a>
				        					<i class="fa fa-pencil-square-o"></i>
				        				</div>
				        			</li>
				        			<div class="clear"></div>
				        		</ul>
				        		<div class="clear"></div>
				        	</div>
				        	<div class="info">
				        		<h5 class="info-title"><img src="/static/images/arrow_right.png" alt="">处理信息</h5>
				        		<ul class="info-abst" style="width: 100%;">
				        			<li style="width: 90%;">
				        				<label for="">处理记录：</label>
				        				<div class="table-box">
					        				<table border="1" cellpadding="0" cellspacing="0" class="table">
					        					<tbody>
					        						<tr>
													    <th>任务名称</th>
													    <th>发起人</th>
													    <th>状态</th>
													</tr>
													<tr>
													    <td>SZ0976XXXX2018</td>
													    <td>Nathan</td>
													    <td>进行中</td>
													</tr>
													<tr>
													    <td>SZ0976XXXX2018</td>
													    <td>Nathan</td>
													    <td>进行中</td>
													</tr>
													<tr>
													    <td>SZ0976XXXX2018</td>
													    <td>Nathan</td>
													    <td>进行中</td>
													</tr>
					        					</tbody>
					        				</table>
				        				</div>
				        			</li>
				        			<li style="width: 220px; margin-top: 5px;">
						        		<div class="button-container">
						        			<a class='button -salmon center'>申请工程师</a>
						        		</div>
						        	</li>
				        			<div class="clear"></div>
				        		</ul>
				        		<ul class="info-abst" style="width: 100%; margin-top: 20px;">
				        			<li style="width: 90%;">
				        				<label for="">备注信息：</label>
				        				<div class="textarea-box">
				        					<textarea name="" id="" cols="30" rows="3" style="width: 100%;">客户将整个案件拆分出的实用新型</textarea>
				        				</div>
				        			</li>
				        			<li style="width: 220px; margin-top: 5px;">
						        		<div class="button-container">
						        			<a class='button -green center'>保存信息</a>
						        		</div>
						        	</li>
				        			<div class="clear"></div>
				        		</ul>
				        		<div class="clear"></div>
				        	</div>
			        	</div>
			        	
			        	<div class="case">
					    	<div class="upload" data-value='/static/images/0.jpg' id='case3'>
					            <div class="case-img-title"><p>摘要附图</p></div>   
					        </div>
					    </div>
					</div>
					<div id="tab2" class="tab_content"> 
						<div class="notes_box">
							<div class="notes_add">
								<p>增加案件记录</p>
								<form action="" class="notes_form">
									<div class="notes_add_left">
										<ul>
											<li>
												<label for="">记录标题：</label>
												<input type="text" class="input-one" placeholder="请输入最新记录信息">
											</li>
											<li>
												<label for="">备注信息：</label>
												<input type="text" class="input-one" placeholder="请输入备注信息">
											</li>
											<li style="margin-top: 15px;">
												<label for="">备注信息：</label>
												<input type="radio" value="1" name="is_show">&nbsp;官方文件&nbsp;&nbsp;
												<input type="radio" value="0" name="is_show" checked="checked">&nbsp;非官方文件
											</li>
											<li style="width: 180px; margin-left: 69px;">
												<div class="button-container">
								        			<a class='button -green center'>增加案件记录</a>
								        		</div>
											</li>
										</ul>
									</div>
									<div class="notes_add_right">
										<div class="notes_case">
											<div class="upload" action='/static/images/0.jpg' id='case1'></div>
										</div>
									</div>
									<div class="clear"></div>
								</form>
								<div class="clear"></div>
							</div>
						</div>
						<div class="tab_two_box">
							<ul class="tab_two_box_ul">
								<li class="menu_item" name="tab_two_1"><a href="#">官方记录</a></li>
								<li class="menu_item active" name="tab_two_2"><a href="#">非官方记录</a></li>
								<div class="clear"></div>
							</ul>
							<div class="tab_two">
								<div class="menu_item_content" id="tab_two_1">
									<table>
										<tbody>
											<tr>
												<td class="sidebar_a_one">
													<div class="sidebar_a_one_box">
														<div class="sidebar_top_time sidebar_green">2016-02-29</div>
														<div class="sidebar_top_title">
															<b>记录：</b>
															<span>2015年06月09日收到专利受通+缴费</span>
														</div>
														<div class="sidebar_top_title">
															<b>案件状态：</b>
															<span>立案阶段</span>
														</div>
														<div class="sidebar_top_title">
															<b>记录者：</b>
															<span>IvyLiu</span>
														</div>
														<div class="sidebar_top_title">
															<b>备注：</b>
															<span>12313213213</span>
														</div>
													</div>
												</td>
												<td>
													<img src="/static/images/hang.png" class="origin_img_one" alt="">
												</td>
												<td class="sidebar_origin">
													<img src="/static/images/kxy.png" class="origin_img_two" alt="">
												</td>
												<td class="sidebar_b_one">
													<table class="sidebar_b_one_table">
														<tbody>
															<tr>
																<td class="sidebar_b_one_td1">
																	<img src="/static/images/chengge.png" alt="">
																</td>
																<td class="sidebar_b_one_td2 sidebar_green"></td>
																<td width="1px"></td>
																<td class="sidebar_b_one_td3">
																	<table class="sidebar_b_one_td3_table sidebar_green_border">
																		<tbody>
																			<tr class="td3_table_tr1 sidebar_green">
																				<td width="50%">文件名称</td>
																				<td width="15%">下载文件</td>
																				<td width="15%">上传日期</td>
																				<td width="20%">上传人</td>
																			</tr>
																			<tr class="td3_table_tr2">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu1.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_green_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu1.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_green_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu1.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_green_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu1.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_green_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu1.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																		</tbody>
																	</table>
																	<div class="sidebar_b_one_td3_button sidebar_green_border1">
																		<div class="button-container">
																			<a class='button -blue center right'>在该记录下上传资料</a>
																			<a class='button -blue center right'>修改案件记录</a>
																			<div class="clear"></div>
																		</div>
																	</div>
																</td>
															</tr>
														</tbody>
													</table>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
								<div class="menu_item_content" id="tab_two_2" style="display: none;">
									<table>
										<tbody>
											<tr>
												<td class="sidebar_a_one">
													<div class="sidebar_a_one_box">
														<div class="sidebar_top_time sidebar_yellow">2018-05-29</div>
														<div class="sidebar_top_title">
															<b>记录：</b>
															<span>2018年05月29日收到专利受通+缴费</span>
														</div>
														<div class="sidebar_top_title">
															<b>案件状态：</b>
															<span>立案阶段</span>
														</div>
														<div class="sidebar_top_title">
															<b>记录者：</b>
															<span>IvyLiu</span>
														</div>
														<div class="sidebar_top_title">
															<b>备注：</b>
															<span>12313213213</span>
														</div>
													</div>
												</td>
												<td>
													<img src="/static/images/hang.png" class="origin_img_one" alt="">
												</td>
												<td class="sidebar_origin">
													<img src="/static/images/kxy.png" class="origin_img_two" alt="">
												</td>
												<td class="sidebar_b_one">
													<table class="sidebar_b_one_table">
														<tbody>
															<tr>
																<td class="sidebar_b_one_td1">
																	<img src="/static/images/chengse.png" alt="">
																</td>
																<td class="sidebar_b_one_td2 sidebar_yellow"></td>
																<td width="1px"></td>
																<td class="sidebar_b_one_td3">
																	<table class="sidebar_b_one_td3_table sidebar_yellow_border">
																		<tbody>
																			<tr class="td3_table_tr1 sidebar_yellow">
																				<td width="50%">文件名称</td>
																				<td width="15%">下载文件</td>
																				<td width="15%">上传日期</td>
																				<td width="20%">上传人</td>
																			</tr>
																			<tr class="td3_table_tr2">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu2.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_yellow_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu2.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_yellow_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu2.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_yellow_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu2.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																			<tr class="td3_table_tr2 sidebar_yellow_border">
																				<td class="td3_table_tr2_td1">
																					<a href="" title="">tu2.jpg</a>
																					<input type="text" class="td3_input1" style="display: none;">
																					<input type="button" value="确定" name="jpg" style="display: none;">
																				</td>
																				<td class="td3_table_tr2_td2">
																					<a href="">下载</a>
																				</td>
																				<td class="td3_table_tr2_td2">2017-11-29</td>
																				<td class="td3_table_tr2_td2">Nathan</td>
																			</tr>
																		</tbody>
																	</table>
																	<div class="sidebar_b_one_td3_button sidebar_yellow_border1">
																		<div class="button-container">
																			<a class='button -blue center right'>在该记录下上传资料</a>
																			<a class='button -blue center right'>修改案件记录</a>
																			<div class="clear"></div>
																		</div>
																	</div>
																</td>
															</tr>
														</tbody>
													</table>
												</td>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<div class="clear"></div>
						</div>
					</div>
					<div id="tab3" class="tab_content">
						<div class="log_box">
							<div id="MainForm">
								<div class="form_boxA">
									<table cellpadding="0" cellspacing="0">
										<tr>
											<th>序号</th>
											<th>任务名称</th>
											<th>任务人</th>
											<th>创建者</th>
											<th>创建时间</th>
											<th>状态</th>
										</tr>
										<tr>
											<td>1</td>
											<td><a href="" class="log_tiitle">Nathan向[CNP-SZ976LS-LYF]->资料记录->[2015年5月28日确认递交信息进行递交]上传了新的资料</a></td>
											<td>test_swzg</td>
											<td>系统自动</td>
											<td>2018-05-14</td>
											<td style="color: #3085be;">交办中</td>
										</tr>
										<tr>
											<td>2</td>
											<td><a href="" class="log_tiitle">Nathan向[CNP-SZ976LS-LYF]->资料记录->[2015年5月28日确认递交信息进行递交]上传了新的资料</a></td>
											<td>test_swzg</td>
											<td>系统自动</td>
											<td>2018-05-14</td>
											<td style="color: #3085be;">交办中</td>
										</tr>
										<tr>
											<td>3</td>
											<td><a href="" class="log_tiitle">Nathan向[CNP-SZ976LS-LYF]->资料记录->[2015年5月28日确认递交信息进行递交]上传了新的资料</a></td>
											<td>test_swzg</td>
											<td>系统自动</td>
											<td>2018-05-14</td>
											<td style="color: #3085be;">交办中</td>
										</tr>
										<tr>
											<td>4</td>
											<td><a href="" class="log_tiitle">Nathan向[CNP-SZ976LS-LYF]->资料记录->[2015年5月28日确认递交信息进行递交]上传了新的资料</a></td>
											<td>test_swzg</td>
											<td>系统自动</td>
											<td>2018-05-14</td>
											<td style="color: #3085be;">交办中</td>
										</tr>
									</table>
									<!-- 分页 -->
									<div class="am-cf">
					                    <div class="am-fr">
					                        <ul class="am-pagination tpl-pagination">
					                            <li class="am-disabled"><a href="#">«</a></li>
					                            <li class="am-active"><a href="#">1</a></li>
					                            <li><a href="#">2</a></li>
					                            <li><a href="#">3</a></li>
					                            <li><a href="#">4</a></li>
					                            <li><a href="#">5</a></li>
					                            <li><a href="#">»</a></li>
					                        </ul>
					                    </div>
					                </div>
								</div>
							</div>
						</div>
					</div>
					<div id="tab4" class="tab_content"> 
						
					</div>
					<div id="tab5" class="tab_content"> 

					</div>
				</div> 
			</div>
			<div class="clear"></div>
		</div>
	</div>


	<!-- Tab切换及二级Tab -->
	<script type="text/javascript"> 
		$(document).ready(function(){ 
			//默认动作 
			$(".tab_content").hide(); //隐藏所有内容
			$("ul.tabs li:first").addClass("active").show(); //激活第一个选项卡
			$(".tab_content:first").show(); //显示第一个选项卡内容
			//在单击事件 
			$("ul.tabs li").click(function() { 
				$("ul.tabs li").removeClass("active"); //删除任何“活动”class 
				$(this).addClass("active"); //在选定的选项卡上添加“活动”class
				$(".tab_content").hide(); //隐藏所有选项卡内容 
				var activeTab = $(this).find("a").attr("href"); //找到相对属性值来标识活动选项卡+内容
				$(activeTab).fadeIn(); //淡入淡出活动内容 
				return false; 
			}); 
		});

		$(".menu_item").click(function(e) {
			$('.menu_item_content').hide()
			$("ul.tabs li:first").addClass("active").show();
			$('#'+$(this).attr('name')).show()
		})
	</script>
	<script type = "text/javascriptt" > $(function() {
        $("#case").upload(
            //该函数为点击放大镜的回调函数，如没有该函数，则不显示放大镜 
            function(_this, data) {
                console.log(data)
            });
    }) 
	</script>
	<!-- H5拖拽上传图片 -->
	<script type="text/javascript">
		$(function(){
			$("#case1").upload();
			$("#case3").upload(
				function(_this,data){
					alert(data)
				}
			)
		})
		$(".fa-pencil-square-o").hide()
		$(".form-input").parent().mouseover(function(e) {
			$(this).children(".fa-pencil-square-o").show()
		}).mouseout(function(e) {
			$(this).children(".fa-pencil-square-o").hide()
		})
		$(".fa-pencil-square-o").click(function(e) {
			input = $(this).prev()
			input.blur(function(e) {
				input.attr('disabled', 'true')
				input.addClass('del-border')
			})
			input.removeAttr('disabled')
			input.removeClass('del-border')
		})
	</script>
	<script type="text/javascript" src="/static/js/jQuery.upload.min.js"></script>
</body>
</html>